<%@taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<%@include file="../WEB-INF/jspf/controlesessao.jspf"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Alterar Competencias_Docentes</title>
        <script type="text/javascript" src="../js/jquery.js" ></script>
        <script type="text/javascript" src="../js/jquery.validate.js"></script>
        <script type="text/javascript" src="../js/forms.js"></script>
        <script type="text/javascript" src="../js/jquery-ui-1.8.2.custom.min.js" ></script>
        <script type="text/javascript" src="../js/jquery.ui.datepicker-pt-BR.js" ></script>
        <link rel="stylesheet" href="../css/ui-lightness/jquery-ui-1.8.2.custom.css">
    <link rel="stylesheet" href="../css/forms.css"></head>
    <script>
        $(document).ready(function(){
            $("#form").validate({
                rules: {
                    id_competencia: {required: true,digits: true
                    }
                    ,matricula: {required: true}
                    ,prazo: {date: true
                    }
                    ,prioridade: {digits: true
                    }
                },
                submitHandler: function(form) {
                    salvar(form);
                }

            });

            $('#prazo').datepicker();
            $('#inicio').datepicker();
        });
         $(function() {
            var cache = {};
            $( "#competencia" ).autocomplete({
                minLength: 3,
                source: function(request, response) {
                    if ( request.term in cache ) {
                        response( cache[ request.term ] );
                        return;
                    }

                    $.ajax({
                        url: "../Competencias/fm_getCompetencias.jsp",
                        dataType: "json",
                        type: "POST",
                        data: request,
                        success: function( data ) {
                            cache[ request.term ] = data;
                            response( data );
                        }
                    });
                },
                select: function(event, ui) {
                    setCompetencia(ui.item ? (ui.item.id) : "");
                }
            });
        });
        function setCompetencia (txt){
            $("#id_competencia").val(txt);
        }
    </script>


    <body>

        <form name="form" id="form" method="post" action="update.jsp" >
            <fieldset><legend>Dados</legend>
                <sql:query var="query" dataSource="jdbc/dbo_MicrosoftSQLServer">
                    SELECT  d.*,  desc_competencia FROM Competencias_Docentes d
                    inner join competencias c on d.id_competencia=c.id_competencia
                    where d.id_competencia=? and matricula=?
                    <sql:param value="${param.id_competencia}"/>
                    <sql:param value="${param.matricula}"/>
                </sql:query>
                <c:forEach var="row" items="${query.rows}">
                    <input type="hidden" name="matricula" value="${row.matricula}">
                    
                    <input type="hidden" id="id_competencia" name="id_competencia" value="${row.id_competencia}">
                    <p><label class="lbInput">Competência: </label>
                        <input type="text" value="${row.desc_competencia}" name="competencia" id="competencia" size="60">
                    </p>
                    <fmt:formatDate value="${row.prazo}" var="data" pattern="dd/MM/yyyy"/>
                    <fmt:formatDate value="${row.inicio}" var="inicio" pattern="dd/MM/yyyy"/>
                    <p><label class="lbInput">Início</label>
                        <input type="text" id="inicio" name="inicio" size="12" maxlength="12" value="${inicio}">
                    </p>
                    <p><label class="lbInput">Fim</label>
                        <input type="text" id="prazo" name="prazo" size="12" maxlength="12" 
                        value="${data}">
                    </p>
                    <p><label class="lbInput">prioridade<em>*</em></label>
                        <input type="radio" name="prioridade" value="1" ${row.prioridade=='1'?'checked':''}   class="required"><label>Baixa</label>
                        <input type="radio" name="prioridade" value="2" ${row.prioridade=='2'?'checked':''}   class="required"><label>Média</label>
                        <input type="radio" name="prioridade" value="3" ${row.prioridade=='3'?'checked':''}   class="required"><label>Alta</label>
                    </p>
                </c:forEach><p>
                    <input class="submit" type="submit" value="Salvar">
                    <input class="submit" type="button" value="Remover" onclick="remover(document.forms[0])" style="visibility:visible">
                    <input class="submit" type="button" value="Listar" onclick="listar('fm_lista_Competencias_Docentes.jsp')">
                </p>
                <div id="ajax_dados" style="display:block">
                </div>
                <div id="msg" style="display:none"></div>
            </fieldset>
        <input type="hidden" id="token" name="token" value="${sessionScope.token}" /> </form>
    </body>
</html>
